<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title>eq</title>
        <link type="text/css" rel="stylesheet" href='../../css/c1.css'>
        <style>
        p{
                padding:0 10px;
            }
        </style>
        <script src="../../work/jquery-1.12.4.min.js"></script>
        <script>
            jQuery(function ($) {
                $("#btn1",".code").click(function () {
                    $("tr").eq(1).css({backgroundColor:'red'});
                    //$("tr").eq(-2).css({backgroundColor:'red'});
                });

            });
        </script>
    </head>
    <body>
    <div class="title">eq(index|-index)</div>
    <p>获取第N个元素</p>
    <p style="font-weight: bold">index</p>
    <p style="padding:5px 20px;">一个整数，指示元素基于0的位置,这个元素的位置是从0算起。</p>
    <hr/>
    <p style="font-weight: bold">-index</p>
    <p style="padding:5px 20px;">一个整数，指示元素的位置，从集合中的最后一个元素开始倒数。(1算起)。</p>
    <hr/>
    <div class="title">代码示例</div>
    <div class="code">
                        <pre>

                            &lt;script&gt;
                                jQuery(function ($) {
                                    $("#btn1",).click(function () {
                                         $("tr").<span>eq(1)</span>.css({backgroundColor:'red'});
                                        //<span> $("tr").eq(-2).css({backgroundColor:'red'});</span>
                                        //<span>获取匹配的第二个元素</span>
                                    });
                                });
                           &lt;/script&gt;

                          &lt;table border="1"&gt;
                                &lt;tr&gt;&lt;td&gt;Header 1&lt;/td&gt;&lt;/tr&gt;
                                &lt;tr&gt;&lt;td&gt;Value 1&lt;/td&gt;&lt;/tr&gt;
                                &lt;tr&gt;&lt;td&gt;Value 2&lt;/td&gt;&lt;/tr&gt;
                          &lt;/table&gt;
                          &lt;button id="btn1" style="margin: 10px;"&gt;点击查看效果&lt;/button&gt;
                        </pre>
    </div>
    <div class="title">代码示例</div>
    <div class="code">
        <table border="1">
            <tr><td>Header 1</td></tr>
            <tr><td>Value 1</td></tr>
            <tr><td>Value 2</td></tr>
        </table>
        <button id="btn1" style="margin: 10px;">点击查看效果</button>
    </div>
    </body>
</html>